
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>纪念日</title>
<link rel="stylesheet"
	href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<!-- Vue -->

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script type="text/javascript" src="../../js/qs.js"></script>
<script type="text/javascript" src="../../js/jquery-3.1.0.js"></script>
<link href="http://cdn.xtcrm.com/cdn//v7/fm/ub/css/icons.css"
	rel="stylesheet" type="text/css">
<link rel="stylesheet" type="text/css" href="../../css/anniversaryList.css" />


</head>
<body class="fixed-left">
	<div class="enlarged forced abc" id="wrapper">
		<div class="content-page crm" style="margin: 0;padding: 0">
			<div class="content" style="margin: 0;padding: 0">
				<div class="container-fluid" style="min-height: 900px;">
					<div class="row">

						<div id="idid" class="col-sm-12">
						<el-form :model="ruleForm" ref="ruleForm" class="demo-ruleForm">

						<!----------------筛选、查询input代码开始-------------------->
						<div id="search">

							<div style="height: 50px; width: 500px; margin: 0 auto;" id="app">
								<el-input placeholder="客戶名称" v-model="ruleForm.input"
									class="input-with-select"> 
									<el-select  style="width:120px;"
									v-model="ruleForm.selects" slot="prepend" clearable
									placeholder="全部数据"> <el-option label="公司周年"
									value="2111"></el-option> <el-option label="客户生日" value="2112"></el-option>
								</el-select> <el-button slot="append"
									icon="el-icon-search" @click="submitForm('ruleForm')"></el-button>

								</el-input>
							</div>
						</div>
						<!----------------列表-------------------->

						<div id="qlist" style="z-index: 0">
							<div id="editqlist"
								style="position: absolute; display: none; &amp;#9; left: 0; &amp;#9; top: 0; width: 0; &amp;#9; height: 0; z-index: 100; background-color: #D4D0C8;">
							</div>
								<div class="row m-t-15 f-s-12" style="height: 35px;">
									<div class="col-sm-6">
										<span set-lan="html:联系人纪念日">联系人纪念日</span>
									</div>
									<div class="col-sm-6 text-right add"
										style="width: 120px; float: right;">
										<el-button class="btn btn-white "
											 :plain="true" @click="showDialog()">
											<i class="el-icon-circle-plus"></i>新建
										</el-button>
										<el-dialog :visible.sync="centerDialogVisible"
										width="900px" center> <iframe src="/customer/anniversaryAdd"
										width="100%" frameborder="0"
										onload="this.height=this.contentWindow.document.body.scrollHeight,this.width = 
										this.contentWindow.document.body.scrollWidth"></iframe>
									</el-dialog>
									</div>
								</div>
								<div class="tab-content p-0">
									<div class="bootstrap-table m-t-10">
										<div class="fixed-table-container overflow-x-auto">
											<table class="table table-bordered table-hover table-z"
												id="qlist_table">
												<thead>
													<tr>
														<th class="bs-checkbox" style="width: 36px;">
															<div class="th-inner">
																<input name="selcon"
																	onclick='setQlistChk("formedit_qlist",this.checked);'
																	type="checkbox" data-parsley-multiple="selcon">
															</div>
															<div class="fht-cell"></div>
														</th>

														<th class="th-inner">
															<p>
																<a class="na"
																	href="JavaScript:qlist_argv_orderf='id'; qlist_argv_orderv=0;qlist_load();"
																	set-lan="html:ID">ID</a>
															</p>
														</th>
														<th class="th-inner">
															<p align="left">
																<a class="na"
																	href="JavaScript:qlist_argv_orderf='type'; qlist_argv_orderv=0;qlist_load();"
																	set-lan="html:纪念日类型">纪念日类型</a>
															</p>
														</th>
														<th class="th-inner">
															<p align="left">
																<a class="na"
																	href="JavaScript:qlist_argv_orderf='cu_id'; qlist_argv_orderv=0;qlist_load();"
																	set-lan="html:客户">客户</a>
															</p>
														</th>
														<th class="th-inner">
															<p align="left">
																<a class="na"
																	href="JavaScript:qlist_argv_orderf='con_id'; qlist_argv_orderv=0;qlist_load();"
																	set-lan="html:联系人">联系人</a>
															</p>
														</th>
														<th class="th-inner">
															<p align="left">
																<a class="na"
																	href="JavaScript:qlist_argv_orderf='tt'; qlist_argv_orderv=0;qlist_load();"
																	set-lan="html:纪念日">纪念日</a>
															</p>
														</th>
														<th class="th-inner">
															<p align="left">
																<a class="na"
																	href="JavaScript:qlist_argv_orderf='nextdate'; qlist_argv_orderv=0;qlist_load();"
																	set-lan="html:下一次提醒">下一次提醒</a>
															</p>
														</th>
														<th class="th-inner">
															<p align="left">
																<a class="na"
																	href="JavaScript:qlist_argv_orderf='creatdate'; qlist_argv_orderv=0;qlist_load();"
																	set-lan="html:创建日期">创建日期</a>
															</p>
														</th>
														<th class="th-inner">
															<p>
																<a class="na" style="color: black; margin-left: 10px;">操作</a>
															</p>
														</th>
													</tr>
												</thead>
												<tbody class="bg-white">
													<tr v-for="(list,i) in tableData" v-model="tableData">
														<td><input name="sel_id[]" type="checkbox" value="8"
															data-parsley-multiple="sel_id"></td>
														<td>
															<p>{{list.ann_id}}</p>
														</td>
														<td>
															<p align="left">
																<a id="qlist_F8" onclick=" reportMove(this) ;"
																	href='JavaScript:qlist_click_todetail("8","868161");'><i
																	class="fa fa-arrow-circle-right text-blue m-r-5"></i>{{list.dic_name }}</a>
															</p>
														</td>
														<td>
															<p align="left">
																<span style="font-weight: normal; color: #9e9e9e">〖</span>{{list.cus_name }}
																<a
																	:href="'/cusview?id='+list.cus_id"><i
																	class="fa fa-folder-open m-l-5"
																	data-original-title="打开详细页面" data-toggle="tooltip"
																	data-placement="bottom"></i></a><span
																	style="font-weight: normal; color: #9e9e9e">〗</span>
															</p>
														</td>
														<td>
															<p align="left">
																<span style="font-weight: normal; color: #9e9e9e">〖</span>{{list.lin_name }}
																<a
																	href="javascript:vopen('/xcrm/customer/contact/detail.xt?id=146','contact146',999,600);"><i
																	class="fa fa-folder-open m-l-5"
																	data-original-title="打开详细页面" data-toggle="tooltip"
																	data-placement="bottom"></i></a><span
																	style="font-weight: normal; color: #9e9e9e">〗</span>
															</p>
														</td>
														<td>
															<p align="left">{{dateFormat(list.ann_date)}}</p>
														</td>
														<td>
															<p align="left">{{dateFormat2(list.ann_date)}}</p>
														</td>
														<td>
															<p align="left">{{dateFormat(list.createdate)}}</p>
														</td>
														<td width="1%" nowrap=""><a title="删除" data-original-title="删除"
															data-placement="bottom"  @click="delanni(list.ann_id)"><i
																class="el-icon-delete m-r-5"></i></a>&nbsp; <a
															title="编辑"data-original-title="编辑"
															data-placement="bottom" @click="editanni(list.ann_id)"><i
																class="m-r-5 el-icon-edit"></i></a>&nbsp;</div>
														</td>
													</tr>
												</tbody>
											</table>
											<el-dialog title="提示" :visible.sync="dialogVisible"
																			width="30%"> <span>您确认要删除此记录吗？</span> <span
																			slot="footer" class="dialog-footer"> <el-button
																				@click="dialogVisible = false">取 消</el-button> <el-button
																				type="primary" @click="update(ann_id)">确
																			定</el-button>

																		</span> </el-dialog>
											
										</div>
									</div>
									<div class="row m-t-10">
										<div class="col-sm-3">
											<input name="sel_type" type="hidden" value="0"> <a
												title="删除"><button
													class="btn btn-white btn-custom waves-effect waves-light"
													onclick="if (confirm('确认删除选中数据及其视图下关联数据吗？')) { $('form[name=formedit_qlist]').find('input[name=sel_type]').val('0').end().submit();};return  false;"
													data-original-title="删除" data-toggle="tooltip"
													data-placement="bottom">
													<i class="el-icon-delete"></i>
												</button></a> &nbsp; <a title="批量编辑"><button
													class="btn btn-white btn-custom waves-effect">
													<i class="el-icon-edit"></i>
												</button></a>
										</div>
										<div class="col-sm-7">
									<el-pagination @size-change="handleSizeChange"
										@current-change="handleCurrentChange"
										:current-page="ruleForm.currentPage"
										:page-sizes="[10, 20, 30, 40]" :page-size="ruleForm.pagesize"
										layout="total, prev, pager, next, jumper"
										:total="ruleForm.totalCount"> </el-pagination>
								</div>
										<div class="col-sm-2 text-right">
											<!-- BEGIN qqhide -->
											<a title="打印列表" class="btn btn-white btn-custom waves-light"
												href="/system/runmod_print.xt?where=&amp;bwhere=&amp;page=&amp;orderf=&amp;orderv=&amp;pn=&amp;customer_phone_show=0&amp;sid=95&amp;ssn=eqtbhnjoofkukakh9srptfb8c5&amp;ccn=d002&amp;cr=3f45cc49f1d751bb552284054948516d&amp;ma=caec64c353ff1fff4813f3df05349b00&amp;scname=memday&amp;comname=qlist&amp;modcr=d0916b6105e2b6463742e2befb050fdc&amp;customer_phone_show=0&amp;cv=,search,qlist,&amp;qlist_print=1"
												target="_blank" data-original-title="打印列表"
												data-toggle="tooltip" data-placement="bottom"> <i
												class="el-icon-printer"></i></a> <a
												title="导出Excel权限"
												class="btn btn-white btn-custom  waves-effect waves-light"
												href="/setup/setup.xt?func=s_table&amp;dt=memday"
												target="_blank" data-toggle="tooltip"
												data-placement="bottom"><i
												class="el-icon-setting"></i></a>&nbsp;
											<a
												class="btn btn-white easyui-linkbutton" onclick="downloadfile();"
												title="导出Excel格式数据">
												<i class="el-icon-document"></i>
											</a>
											<!-- END qqhide -->
										</div>
									</div>
								</div>
								<!--UTF8-->
						</div>
						<!----------------统计-------------------->
							</el-form>
							<el-dialog :visible.sync="centerDialogVisible4" width="900px" center>
								<iframe :src="FrameSrc" width="100%" onload="this.height=this.contentWindow.document.body.scrollHeight,this.width = this.contentWindow.document.body.scrollWidth" frameborder="0" scrolling="no"></iframe>
									</el-dialog>
							
							
					</div>
					<script>
				var vm = new Vue({
					el: "#idid",
					data() {
						return {
							texts: "",
							centerDialogVisible: false,
							centerDialogVisible4:false,
							dialogVisible:false,
							FrameSrc:"",
							//表格当前页数据
			                tableData: [],
			                
							ruleForm: {
								//搜索框
								input: '',
								//下拉条件按钮
								selects: '',
								 //默认每页数据量
				                pagesize: 10,
				              //当前页码
				                currentPage: 1,
				                //默认数据总数
				                totalCount: '',
				               
						        },
						 ann_id:'' 
						}
					},
					methods: {
						showDialog(){
					    	  this.centerDialogVisible= true;
					      },
					      
					      delanni:function(ann_id){
							this.ann_id= ann_id;
					    	this.dialogVisible = true;
								
					      },
					      update: function(i) {
								//删除
								//alert(i+"sssssss");
								//post提交数据
					    	  axios.post("/customer/delanni",
					           			//参数转换
					           			Qs.stringify({'ann_id':i},{arrayFormat: 'brackets'})
					           			//ajax请求成功的回调函数
					           			).then(function(v){
						           			window.location.replace("/customer/anniversaryList");
						           			console.log("回调成功，获取了服务器端返回的值v");
						           	}).catch(function(e){
						           		alert("出错了"+e);
						           	});
							},
					      
					      
					      
					      editanni(id){
					    	    this.centerDialogVisible4 = true;
								this.FrameSrc="/customer/anniEditor?id="+id;
						}, 
						//从服务器读取数据
		                loadData: function(){  
		                	
		                	var iosnn=this;
		                	//post提交数据
							axios.post("/customer/list",
								//参数转换
								Qs.stringify(this.ruleForm, {
									arrayFormat: 'brackets'
								})		
							).then(function(v) {
								iosnn.tableData = v.data.list;
								iosnn.ruleForm.totalCount = v.data.total;
								console.info(v.data);
							}).catch(function(e) {
								alert("出错了"+e);
							});
		                },
		                handleSizeChange(val) {
		                	this.ruleForm.pagesize = val;
					        console.log( this.ruleForm.pagesize+'条');
					        this.ruleFormloadData();
					      },
					      handleCurrentChange(val) {
					    	  this.ruleForm.currentPage = val;
					        console.log(this.ruleForm.currentPage+'当前');
					        this.loadData();
					       
					      },

					      
						submitForm(formName) {
							//验证方法
							this.$refs[formName].validate((valid) => {
								if(valid) {
									this.loadData();
								} else {
									console.log('error submit!!');
									return false;
								}
							});
						},
						resetForm(formName) {
							this.$refs[formName].resetFields();
						},
						 //   时间格式化
			         	dateFormat:function(time) {
							    var date=new Date(time);
							    var year=date.getFullYear();
							    /* 在日期格式中，月份是从0开始的，因此要加0
							     * 使用三元表达式在小于10的前面加0，以达到格式统一  如 09:11:05
							     * */
							    var month= date.getMonth()+1<10 ? "0"+(date.getMonth()+1) : date.getMonth()+1;
							    var day=date.getDate()<10 ? "0"+date.getDate() : date.getDate();
							    var hours=date.getHours()<10 ? "0"+date.getHours() : date.getHours();
							    var minutes=date.getMinutes()<10 ? "0"+date.getMinutes() : date.getMinutes();
							    var seconds=date.getSeconds()<10 ? "0"+date.getSeconds() : date.getSeconds();
							    // 拼接
							  //  return year+"-"+month+"-"+day+" "+hours+":"+minutes+":"+seconds;
							    return year+"-"+month+"-"+day;
							},
							
						//   下一次提醒时间格式化
				         	dateFormat2:function(time) {
								    var date=new Date(time);
								    var year=date.getFullYear()+1;
								    /* 在日期格式中，月份是从0开始的，因此要加0
								     * 使用三元表达式在小于10的前面加0，以达到格式统一  如 09:11:05
								     * */
								    var month= date.getMonth()+1<10 ? "0"+(date.getMonth()+1) : date.getMonth()+1;
								    var day=date.getDate()<10 ? "0"+date.getDate() : date.getDate();
								    var hours=date.getHours()<10 ? "0"+date.getHours() : date.getHours();
								    var minutes=date.getMinutes()<10 ? "0"+date.getMinutes() : date.getMinutes();
								    var seconds=date.getSeconds()<10 ? "0"+date.getSeconds() : date.getSeconds();
								    // 拼接
								  //  return year+"-"+month+"-"+day+" "+hours+":"+minutes+":"+seconds;
								    return year+"-"+month+"-"+day;
								},
						
					},
					mounted() {
						var iosnn=this;
						//post提交数据
						axios.post("/customer/anniversaryList",
							//参数转换
							Qs.stringify(this.ruleForm, {
								arrayFormat: 'brackets'
							})		
						).then(function(v) {
							iosnn.tableData = v.data.list;
							iosnn.ruleForm.totalCount = v.data.total;
							console.info(iosnn.tableData);
						}).catch(function(e) {
							alert("出错了"+e);
						});
					}
					
				});
			</script>
					
				</div>

			</div>

		</div>
	</div>
	</div>
</body>

</html>